<template>
	<view>
		<image class="bg1" src="@/static/tab/5.png" mode="widthFix"></image>
		<view class="top">
			<p>订单报价为</p>
			<span>{{ form.totalPrice ? form.totalPrice : "" }}</span>
			<b v-if="!zhongwen(form.totalPrice)">元/千升</b>
			<i>报价时间：{{ form.quotationDate ? form.quotationDate : "" }}</i>
		</view>
		<view class="boxs">
			<view class="title">产品信息</view>
			<view class="common-form-card">
				<u-form>
					<u-form-item label="成分1" label-width="100">
						<div class="area">{{ form.drugName1 }}</div>
					</u-form-item>

					<u-form-item label="含量" label-width="100">
						<div class="area">
							{{ form.netContent1 }}
							<view class="tr">克/升</view>
						</div>
					</u-form-item>

					<u-form-item label="剂型" label-width="100">
						<div class="area">{{ form.dosageName }}</div>
					</u-form-item>

					<u-form-item label="特殊指标要求" label-width="100" v-if="form.specialIndicatorRequirements">
						<div class="area">{{ form.specialIndicatorRequirements }}</div>
					</u-form-item>
					<u-form-item label="订单总量" label-width="100">
						<div class="area">
							{{ form.totalAmount }}
							<view class="tr">升</view>
						</div>
					</u-form-item>
				</u-form>
			</view>
			<view class="common-form-card common-form-card2">
				<u-form>
					<u-form-item label="成分2" label-width="100">
						<div class="area">{{ form.drugName2 }}</div>
					</u-form-item>

					<u-form-item label="含量" label-width="100">
						<div class="area">
							{{ form.netContent2 }}
							<view class="tr">克/升</view>
						</div>
					</u-form-item>
				</u-form>
			</view>

			<view class="common-form-card common-form-card2">
				<u-form>
					<u-form-item label="成分3" label-width="100">
						<div class="area">{{ form.drugName3 }}</div>
					</u-form-item>

					<u-form-item label="含量" label-width="100">
						<div class="area">
							{{ form.netContent3 }}
							<view class="tr">克/升</view>
						</div>
					</u-form-item>
				</u-form>
			</view>

			<view class="title">包装要求</view>
			<view class="common-form-card">
				<u-form>
					<u-form-item label="单瓶客量" label-width="100">
						<div class="area">
							{{ form.singleBottleCapacity }}
							<!-- <view class="tr">ML</view> -->
						</div>
					</u-form-item>

					<u-form-item label="阻隔瓶" label-width="100">
						<div class="area">{{ form.ifBlockBottle == 1 ? "是" : "否" }}</div>
					</u-form-item>

					<u-form-item label="彩印标签" label-width="100">
						<div class="area">{{ form.ifColorLabel == 1 ? "是" : "否" }}</div>
					</u-form-item>

					<u-form-item label="每箱装瓶数" label-width="100">
						<div class="area">{{ form.bottlePerBox }}</div>
					</u-form-item>

					<u-form-item label="每瓶加量杯" label-width="100">
						<div class="area">{{ form.ifCup == 1 ? "是" : "否" }}</div>
					</u-form-item>
					<u-form-item label="每瓶加收缩膜" label-width="100">
						<div class="area">
							{{ form.ifBottleWithWrap == 1 ? "是" : "否" }}
						</div>
					</u-form-item>
					<u-form-item label="每瓶加纸盒" label-width="100">
						<div class="area">
							{{ form.ifBottleWithPaperBox == 1 ? "是" : "否" }}
						</div>
					</u-form-item>

					<u-form-item label="特殊形状瓶" label-width="100" v-if="form.specialBottle">
						<div class="area">{{ form.specialBottle }}</div>
					</u-form-item>
				</u-form>
			</view>

			<view class="box_height_20"></view>
		</view>
	</view>
</template>

<script>
	// 配置信息
	import {
		detail
	} from "@/config/api.js";
	import config from "../../libs/config/config.js";
	export default {
		computed: {},
		data() {
			return {
				price: 236,
				time: "2024.10.18",
				tfList: ["是", "否"],
				provinceList: ["碳酸钙", "氯化钠"], 
				cityList: "",
				areaList: [], 
				index: 0, // 当前选择的省份索引
				cityIndex: 0, // 当前选择的城市索引
				areaIndex: 0, // 当前选择的区县索引
				allData: [], // 所有省市区数据
				fileList1: [],
				fileList2: [],
				ok: false,
				showType: false,

				showDate: false,
				showValidityBeginDate: false,
				showValidityEndDate: false,
				form: {
					totalPrice: "",
					quotationDate: "",
					dosageName: "",
					specialIndicatorRequirements: "",
					totalAmount: 0,
					drugName1: "",
					netContent1: 0,
					drugName2: "",
					netContent2: 0,
					drugName3: "",
					netContent3: 0,
					singleBottleCapacity: "",
					ifBlockBottle: 0,
					ifColorLabel: 0,
					bottlePerBox: 0,
					ifCup: 0,
					ifBottleWithWrap: 0,
					ifBottleWithPaperBox: 0,
					specialBottle: "",
				},
				selectList: [],
			};
		},
		onLoad(e) {
		

			console.log(111133331);
			this.getdetail(e.id);
		},

		methods: {
			zhongwen(str) { // 匹配中文字符的正则表达式
				const reg = /[\u4e00-\u9fa5]/;
				return reg.test(str);
			},
			async getdetail(e) {
				console.log(11111);

				await detail(e).then((res) => {
					this.form = res;
					console.log(res);
				});
			},
			switch1Change: function(e) {
				if (this.form.defaultFlag == 0) {
					this.form.defaultFlag = 1;
				} else {
					this.form.defaultFlag = 0;
				}
				console.log("switch1 发生 change 事件，携带值为", e.detail.value);
			},
			
		
			
			findChildrenById(id, list) {
				for (let item of list) {
					if (item.id === id && item.children.length > 0) {
						return item.children;
					}
				}
				return [];
			},
			
			findItemById(id, list) {
				for (let i = 0; i < list.length; i++) {
					if (list[i].id === id) {
						return i;
					}
				}
				return -1; // 如果未找到，返回-1
			},

	
			go(e) {
				uni.navigateTo({
					url: e,
				});
			},

			// 删除图片
			deletePic2(event) {
				this.fileList2.splice(event.index, 1);
			},
			// 新增图片
			async afterRead2(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file);
				let fileListLen = this.fileList2.length;
				lists.map((item) => {
					this.fileList2.push({
						...item,
						status: "uploading",
						message: "上传中",
					});
				});
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url);
					let item = this.fileList2[fileListLen];
					this.fileList2.splice(
						fileListLen,
						1,
						Object.assign(item, {
							status: "success",
							message: "",
							url: result,
						})
					);
					fileListLen++;
				}
			},

			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1);
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file);
				let fileListLen = this[`fileList${event.name}`].length;
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: "uploading",
						message: "上传中",
					});
				});
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url);
					let item = this[`fileList${event.name}`][fileListLen];
					this[`fileList${event.name}`].splice(
						fileListLen,
						1,
						Object.assign(item, {
							status: "success",
							message: "",
							url: result,
						})
					);
					fileListLen++;
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: uni.getStorageSync("baseURL") + "/infra/file/upload", // 仅为示例，非真实的接口地址
						filePath: url,
						name: "file",
						header: {
							Authorization: "Bearer " + uni.getStorageSync("loginTokens"),
						},
						success: (res) => {
							setTimeout(() => {
								let jsonString = res.data;
								let jsonObject = JSON.parse(jsonString);
								resolve(jsonObject.data);
							}, 1000);
						},
					});
				});
			},
			confirmType(e) {
				this.showType = false;
				this.form.contractId = e.value[0].value;
				this.form.contractName = e.value[0].label;
			},

			changeNum() {
				this.form.prices = (this.form.kg * 22).toFixed(2);
			},
			submit() {
				console.log(this.fileList2);

				if (this.form.id) {
					addressUpdate(this.form).then((res) => {
						console.log(res);
						if (res) {
							uni.$u.toast("修改成功");

							setTimeout(() => {
								uni.navigateBack({
									delta: 1,
								});
							}, 1500);
						}
					});
				} else {
					addressCreate(this.form).then((res) => {
						console.log(res);
						if (res) {
							uni.$u.toast("提交成功");

							setTimeout(() => {
								uni.navigateBack({
									delta: 1,
								});
							}, 1500);
						}
					});
				}
			},
		},
	};
</script>
<style lang="scss">
	page {
		background: #ffffff;
	}
</style>
<style scoped lang="scss">
	page {
		background: #ffffff;
	}

	.top {
		width: 100%;
		height: auto;
		display: block;
		margin: 100rpx 0 0;
		position: relative;
		z-index: 2;
	}

	.top p {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 36rpx;
		color: #1c2023;
	}

	.top span {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 50rpx;
		font-weight: bold;
		color: #ee5e5e;
		margin: 30rpx 0 0rpx;
		box-sizing: border-box;
		padding: 0 50rpx;
	}

	.top b {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 36rpx;
		color: #1c2023;
		font-style: normal;
		
	}

	.top i {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 36rpx;
		color: #49b9ad;
		font-style: normal;margin:30rpx 0 0 ;
	}

	.bg1 {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 0;
	}

	.tr {
		display: block;
		float: right;
		color: #787879;
		font-size: 28rpx;
		margin-left: 20rpx;
	}

	.line {
		height: 45px;
		font-weight: bolder;
		font-size: 32rpx;
	}

	.line_line {
		height: 45px;
		border-bottom: 1px solid #eee;
	}

	.noi {
		width: 342rpx;
		height: auto;
		display: block;
		float: left;
		margin: 340rpx 204rpx 50rpx;
	}

	.not {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 30rpx;
		color: #414141;
	}

	::v-deep .u-form-item {
		border-bottom: 1px solid #e9e9e9;
	}

	::v-deep .u-form-item:last-child {
		border: 0;
	}

	::v-deep .u-form-item__body__left__content__label {
		span {
			color: #1c2023;
			font-size: 28rpx;
		}
	}

	.common-form-card {
		margin: 0 0 15rpx;
		width: 690rpx;
		display: block;
		float: left;
		border-radius: 0;
		box-shadow: none;
		background: none !important;
	}

	.select {
		width: 100%;
		float: right;
		text-align: right;
		color: #c0c4cc;
		font-size: 15px;
	}

	.select .active {
		color: #303133;
	}

	.upload_box {
		float: right;
		text-align: right;
		align-items: flex-end;
	}

	.area {
		float: right;
		text-align: right;
		width: 100%;
		display: flex;
		justify-content: flex-end;
		color: #1c2023;
		font-size: 28rpx;
		position: relative;
		z-index: 3;
	}

	.picker {
		margin: 0 0 5rpx;
		display: inline-block;
		box-sizing: border-box;
		padding: 0 10rpx;
	}

	.pickerno {
		color: rgb(192, 196, 204);
		font-size: 28rpx;
	}

	.title {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		padding: 25rpx 0 25rpx 25rpx;
		box-sizing: border-box;
		font-size: 36rpx;
		color: #49b9ad;
	}

	.boxs {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		position: relative;
		z-index: 3;
		margin: 0 0 50rpx;
		padding-bottom: 100rpx;
	}

	.df_1 {
		background: #49b9ad;
		color: #fff;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 20rpx;
		width: 700rpx;
		margin: 60rpx 25rpx 100rpx;
		padding: 0;
		float: left;
	}

	::v-deep .u-button--primary {
		background: none !important;
		border: 0;
		width: 100% !important;
		padding: 0 !important;
	}

	.common-form-card2 {
		margin: 30rpx 0 0 0;
	}
</style>